import React,{Component} from "react"

import {Link} from "react-router-dom";
import BScroll  from "better-scroll";

import img1 from "../../images/num1.png"
import img2 from "../../images/num2.png"
import img3 from "../../images/num3.png"
import './index.css'
import editImg from "../../images/mywork.png"
import loadingImg from "../../images/loading.gif"
import {getCourseList,getRankList,getnewsList,getRankDetail} from "../../api/course"
import Item from "antd-mobile/lib/popover/Item";

function toZero(n){
  return n>9 ? ""+n:"0"+n
}



class Index extends Component{
    constructor(props){
    	super(props);
    	this.state = {
            coursetitles:[],
           newslist:[],
           nowIndex:0,
           pageloading:false,
           tabbar:["课程列表","排行列表"],
           courselink:true
    	}
    }
    

    

    componentDidMount(){
        let that = this
        let login = localStorage.getItem('loginadmin') 
        if(!login){
           that.props.history.push(this.state.courselink?'./loginadmin':'/fanscourse/loginadmin')
           return
        }
        that.setState({pageloading:true})
        getnewsList('news').then(res=>{
            that.setState({
                newslist:JSON.parse(res.data.data.data)
            })
        })
    //   this.loadHot();
    //   this.loadRank();
    //   this.gethotlist(0,10);
    //   this.getRanklist(0);
    this.getdata();
    }

    getdata(){
        let that = this
        getCourseList(0,20).then((data)=>{
            // let title = that.state.coursedata
            // title.coursetitles = data.data
            that.setState({coursetitles:data.data,pageloading:false})
        })
    }
    
  



    edit(e,index){
        let that = this
        getRankDetail('','news').then(res=>{
            that.setState({
                newslist:JSON.parse(res.data.data.data)
            })
            let item = that.state.newslist
            let id = ''
            for(let i=0;i<item.length;i++){
                if(e.PostId == item[i].courseid){
                    id = item[i]._id.$oid
                  }
            }
            if(id){
                this.props.history.push(this.state.courselink?'./courseadmin/'+ id:'/fanscourse/courseadmin/'+ id )
                     return  
            }else{
                this.props.history.push({pathname:this.state.courselink?'./courseadmin/add':'/fanscourse/courseadmin/add',
                 state:{title:e.Title,postid: e.PostId,index:index}})
            }
            console.log(that.state.newslist)
        })
       
    }
    preview(e){
        let id = e.courseid
        this.props.history.push(this.state.courselink?'./detail/'+id:'/fanscourse/detail/' +id )
        
    }
    addrank(){
        this.props.history.push(this.state.courselink?'./rankadmin/add':'/fanscourse/rankadmin/add')
    }
    toadmin(){
        this.props.history.push(this.state.courselink?'./courseadmin/add':'/fanscourse/courseadmin/add')
    }
    
    tabHandl(nowIndex){
        if(nowIndex == '0'){
            this.props.history.push(this.state.courselink?'./courselist':'/fanscourse/courselist')
        }else{
            this.props.history.push(this.state.courselink?'./ranklist':'/fanscourse/ranklist')
        }
   }
   out(){
     localStorage.clear()
     this.props.history.push(this.state.courselink?'./loginadmin':'/fanscourse/loginadmin')
   }
	render(){
		let {tabbar,nowIndex,ranklist,hotlist,nowDate} = this.state;
		return(
            <div className="newslist">
                <div className='out' onClick={this.out.bind(this)}>退出</div>
                <div className="tab">
                    {tabbar.map((item,index) => <span key={index} 
                            className={nowIndex===index?"active":""} 
                            onClick={this.tabHandl.bind(this,index)}>
                            {item}
                    </span>)}
                </div>
                <div className='addcourse' onClick={this.toadmin.bind(this)}>添加</div>
                {this.state.coursetitles.map((item,index)=>{
                     return <div className='newscon' key={index}>
                         <div className='edit' onClick={this.edit.bind(this,item,index)}><img src={editImg}/></div>
                         <div className='title'>{item.Title}</div>
                         {this.state.newslist.map((items,index)=>{
                     return item.PostId == items.courseid?<div className='newscon' key={index}>
                         <div className='preview' onClick={this.preview.bind(this,items)}>前台预览</div>
                     {/* <div className='edit' onClick={this.edit.bind(this,items)}><img src={editImg}/></div> */}
                     {/* <div className='title'>{items.coursetitle}</div> */}
                     <div className='flexbox'>
                         <div className='userimg'><img src={items.imgurl}/></div>
                         {items.coursetutor}
                     </div>
                     <div className='videocontain'>
                     {items.addItemList.map((itemss,indexs)=>{
                         return <div className='videocon' key={indexs}>
                             <iframe src={itemss.link}></iframe>
                          
                     <div>{itemss.title}</div>
                         </div>
                     })}
                     </div>
                 </div>:''
                 })}
                     </div>
                 })}
                
               {this.state.pageloading?<div className='popuploading' >
                   <div className='loading'><img src={loadingImg}/></div>
               </div>:''}
                
            </div>
		)
	}
}


export default Index